import React, { FC, CSSProperties, Children, useContext } from 'react';
import classNames from 'classnames';
import formContext from './context';
// import { itemType } from './interface';

export interface colTypeProps {
  className?: string;
  style?: CSSProperties;
  span?: number;
  /**
   * 偏移
   * **/
  offset?: number;
}

export const cal: FC<colTypeProps> = props => {
  const { className, style, children, span, offset } = props;
  // 得到父组件传递的Context
  const { gutter } = useContext(formContext);

  const classes = classNames(className, {
    [`ant-col-offset-${offset}`]: offset,
    [`ant-col ant-col-${span}`]: span,
  });
  // 设置间隔
  const styleTrans = {
    paddingLeft: `-${gutter / 2}px`,
    paddingRight: `-${gutter / 2}px`,
    ...style,
  };
  return (
    <div className={classes} style={styleTrans}>
      {children}
    </div>
  );
};
export default cal;
